/*
This file is part of vlc-remote.

vlc-remote is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

vlc-remote is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with vlc-remote.  If not, see <http://www.gnu.org/licenses/>.
*/
import QtQuick 1.1
import com.meego 1.0
import "common"
import "mediaRemoteFunctions.js" as MediaRemote
import "remoteStatus.js" as RemoteStatus
import "vlcRemote.js" as VlcRemote

Page {
    id: mainPage
    tools: commonTools
    property string server: ""
    property string serverName: "Not connected"
    //property bool playing: false
   // property bool paused: false

    Component.onCompleted: {
        screen.allowedOrientations = Screen.Portrait;
        //lockInPortrait = true;
        orientationLock = Screen.Portrait;

        if ("" == server || null === server) {
            // no op
        }
        else {
            MediaRemote.init(server);
            //coverArtModel.reload();
            //MediaRemote.remoteGetStatus();
        }
    }
    onServerChanged: {
        if ("" == server || null === server) {
            // no op
        }
        else {
            MediaRemote.init(server);
            coverArtModel.reload();
            MediaRemote.remoteGetStatus();
        }
    }
    onVisibleChanged:  {
        if (visible) {
            if ("" == server || null === server) {
                pageStack.push(remotesPage);
            }
            else {
                timer.start();
            }
        }
        else {
            timer.stop();
        }
    }

    Timer {
        id: timer
        interval: !platformWindow.visible ? 3600000 : screen.minimized ? playerRefreshThumbnailed : playerRefreshFocused;
        repeat: true
        running: true
        triggeredOnStart: true

        onTriggered: {
            //coverArtModel.reload();
            MediaRemote.remoteGetStatus();
        }
    }
    ButtonStyle {
        id: vlcButtonStyle
        textColor: "white"
        background: "black"
    }

    Rectangle {
        id: extras
        z: 1
        y: 56
        visible: false
        width: 480
        height: 394
        opacity: 0.75
        color: "black"
        Column {
            y: 8
            Text {
                id: fullTitle
                width: 468
                anchors.leftMargin: 12
                anchors.left: parent.left
                text: nowPlaying.title
                color: "white"
                font.pixelSize: 40
                font.letterSpacing: -3
                font.bold: false
                maximumLineCount: 4
                wrapMode: "WrapAtWordBoundaryOrAnywhere"
            }
            Text {
                id: fullAlbum
                x: 12
                width: 468
                anchors.leftMargin: 12
                anchors.left: parent.left
                anchors.top: fullTitle.bottom
                text: nowPlaying.album
                color: "white"
                font.pixelSize: 36
                font.letterSpacing: -3
                font.bold: false
                maximumLineCount: 4
                wrapMode: "WrapAtWordBoundaryOrAnywhere"
            }
            Text {
                id: fullArtist
                x: 12
                width: 468
                anchors.leftMargin: 12
                anchors.left: parent.left
                anchors.top: fullAlbum.bottom
                text: nowPlaying.artist
                color: "white"
                font.pixelSize: 32
                font.letterSpacing: -3
                font.bold: false
                maximumLineCount: 4
                wrapMode: "WrapAtWordBoundaryOrAnywhere"
            }
        }
        Row {
            y: 354
            Text {
                id: positionLabel
                anchors.margins: 4
                color: "white"
                font.pixelSize: 20
                text: position
            }
            Slider {
                id:sliderPosition
                anchors.margins: 4
                stepSize:0.5
                valueIndicatorVisible: true
                minimumValue:0
                maximumValue:100
                width:350
                height: 20
                value: played
                onPressedChanged: {
                    if (!pressed) MediaRemote.remoteRequestSeekToPercentage(value);
                }
            }
            Text {
                id: durationLabel
                anchors.margins: 4
                color: "white"
                font.pixelSize: 20
                text: duration
            }
        }
    }

    Column {
        id: playingDetails
        //z: 1

        XmlListModel {
            id: coverArtModel
            source: "http://"+server+"/requests/playlist.xml"
            query: "//leaf[@current='current']"

            XmlRole { name: "trackId"; query: "@id/string()"; isKey: true }
            XmlRole { name: "current"; query: "@current/string()"; isKey: true }

        }

        ListView{
            id: coverArt
            anchors.top: parent.top
            width: coverWidth
            height: coverHeight
            //flickableDirection: "HorizontalFlick"
            snapMode: ListView.SnapOneItem

            model:coverArtModel

            delegate: Rectangle {
                color: "black"
                width: coverArt.width
                height: coverArt.height

                Image {
                    id: image
                    width: coverWidth
                    height: coverHeight
                    sourceSize.width: coverWidth
                    sourceSize.height: coverHeight
                    source: "http://"+server+"/art?id="+trackId
                    onStatusChanged: {
                        currentPlaylistItemId = trackId;
                        if (3 == status) {
                            source = "gfx/vlc-256.png";
                        }
                    }
                }
            }


        }

        NowPlayingDetails {
            id: nowPlaying
            anchors.top: coverArt.bottom
            color: "black"
            artist: appWindow.artist
            album: appWindow.album
            title: appWindow.title
        }


        PageHeader {
            id: pageHeader
            anchors.top: parent.top
            title: qsTr("Now playing")
            subtitle: serverName + " @ " + server + ""
            opacity: 0.75
            icon: "file:///usr/share/themes/blanco/meegotouch/icons/icon-m-toolbar-content-audio-white.png"
            onClicked: {
                opacity = (1.0 == opacity) ? 0.75 : 1.0;
                extras.visible = !extras.visible;
            }
        }


    }

    Row {
        id: volumeSliderRow
        anchors.bottom: controlsRow.top
        anchors.margins: 16

        Image {
            source: "file:///usr/share/themes/blanco/meegotouch/icons/icon-m-toolbar-volume-off-white.png"
        }

        Slider {
            //anchors.centerIn: parent
            id:sliderVolume
            stepSize:1
            valueIndicatorVisible: true
            minimumValue:0
            maximumValue:100
            width:400
            height: 24
            value: volume

            onPressedChanged: {
                if (!pressed) MediaRemote.remoteRequestSetVolume(value / 100);
            }
        }

        Image {
            source: "file:///usr/share/themes/blanco/meegotouch/icons/icon-m-toolbar-volume-white.png"
        }
    }


    Row {
        id: controlsRow
        height: 64
        spacing: 4
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.bottom: mainPage.bottom
        anchors.topMargin: 8
        anchors.bottomMargin: 8
        Button {            //platformStyle: vlcButtonStyle
            id: btnPrev
            width: 86
            iconSource: "file:///usr/share/themes/blanco/meegotouch/icons/icon-m-toolbar-mediacontrol-backwards-white.png"
            //text: "<<"
            onClicked:  {
                MediaRemote.remoteRequestTrackPrevious();
            }
        }
        Button {
            //platformStyle: vlcButtonStyle
            id: btnPlay
            width: 86
            visible: (!playing)
            iconSource: "file:///usr/share/themes/blanco/meegotouch/icons/icon-m-toolbar-mediacontrol-play-white.png"
            //text: "|>"
            onClicked:  {
               MediaRemote.remoteRequestStartPlayback();
            }
        }
        Button {
            //platformStyle: vlcButtonStyle
            id: btnPause
            width: 86
            visible:  (playing)
            iconSource: (!paused) ? "file:///usr/share/themes/blanco/meegotouch/icons/icon-m-toolbar-mediacontrol-pause-white.png" : "file:///usr/share/themes/blanco/meegotouch/icons/icon-m-toolbar-mediacontrol-play-white.png"
            //text: "||"
            onClicked:  {
                MediaRemote.remoteRequestPausePlayback();
            }
        }
        Button {
            //platformStyle: vlcButtonStyle
            id: btnStop
            width: 86
            iconSource: "file:///usr/share/themes/blanco/meegotouch/icons/icon-m-toolbar-mediacontrol-stop-white.png"
            //text: "[]"
            onClicked:  {
                MediaRemote.remoteRequestStopPlayback();
            }
        }
        Button {
            //platformStyle: vlcButtonStyle
            id: btnNext
            width: 86
            iconSource: "file:///usr/share/themes/blanco/meegotouch/icons/icon-m-toolbar-mediacontrol-forward-white.png"
            //text: ">>"
            onClicked:  {
                MediaRemote.remoteRequestTrackNext();
            }
        }
        Button {
            //platformStyle: vlcButtonStyle
            id: btnFullscreen
            width: 86
            iconSource: "file:///usr/share/themes/blanco/meegotouch/icons/icon-m-toolbar-gallery-white.png"
            //text: "|>"
            onClicked:  {
               MediaRemote.remoteRequestToggleFullscreen();
               pageHeader.notify(qsTr("Toggling fullscreen!"), 2000);
            }
        }
    }
}
